<template>
	<div class="clientRegulate">
		<div class="titleInfo">非工作日</div>
		<div class="table">
			<el-calendar v-model="value">
				<div slot="dateCell" slot-scope="{ data }" @click="allcalendar(data)" class="temp">
					{{ data.day.split('-').slice(1).join('-') }}
					<div style="width:100%;" v-for="(item,index) in scheduleData" :key="index">
						<el-tag type="danger"
							v-if="(item.workingDay).indexOf(data.day.split('-').slice(2).join('-'))!=-1">
							{{item.content}}
						</el-tag>
					</div>
				</div>
			</el-calendar>
		</div>
	</div>
</template>

<script>
//新增和编辑的表单一样，共用一个
export default {
	components: {},
	data() {
		return {
			// Animal: "牛",
            //     IDayCn: "十八",
            //     IMonthCn: "腊月",
            //     Term: "大寒",
            //     astro: "水瓶座",
            //     cDay: 20,
            //     cMonth: 1,
            //     cYear: 2022,
            //     date: "2022-1-20",
            //     festival: null,
            //     gzDay: "癸酉",
            //     gzMontn: "辛丑",
            //     gzYear: "辛丑",
            //     isLeap: false,
            //     isTerm: true,
            //     isToday: false,
            //     lDay: 18,
            //     lMonth: 12,
            //     lYear: 2021,
            //     lunarDate: "2021-12-18",
            //     lunarFestival: null,
            //     nWeek: 4,
            //     ncWeek: "星期四"
			value: new Date(),
			calendar: '',
			scheduleData: [{
				workingDay: "02",
				content: "休",
			},
			{
				workingDay: "03",
				content: "休",
			},
			{
				workingDay: "04",
				content: "休",
			},
			{
				workingDay: "05",
				content: "休",
			},
			{
				workingDay: "06",
				content: "休",
			},
			{
				workingDay: "07",
				content: "休",
			},
			],
		};
	},
	methods: {
		allcalendar(data) {
			this.calendar = data.day
			console.log(data)
		},
	},
	mounted() {
		// 初始化调用接口
		// this.adminOption()
	}
};
</script>

<style lang="scss" scoped>
/deep/.el-calendar-day {
	box-sizing: border-box;
	padding: 5px;
	height: 80px;
}

.el-calendar {
	text-align: center;
}

.temp {
	padding: 20px;
}

.is-selected-1 {
	width: 100%;
	height: 100%;
}

.titleInfo {
	margin-top: 20px;
	margin-left: 20px;
}

.table {
	background: #ffffff;
	border-radius: 10px;
	margin-top: 20px;
	padding-bottom: 20px;
	margin-left: 20px;
	margin-right: 20px;

}
</style>
